<template>

  <view class="box">
    <button @click="chooseadd" v-if="address=='{}'" style="margin:20px  auto;" size="mini" type="primary">添加收货地址+</button>
    <view v-else class="addressInfo" @click='chooseadd'>
      <view class="box2">
        <text>收货人：{{address.userName}}</text>
        <text> 电话:{{address.telNumber}} > </text>
      </view>
      <view class="">
        收货地址：{{address.infoAddress}}
      </view>


    </view>
  </view>

</template>

<script>
  import {
    mapState,
    mapMutations
  } from 'vuex'
  export default {
    data() {
      return {};
    },
    computed: {
      ...mapState("user", ['address'])
    },
    methods: {
      ...mapMutations('user', ['UpdateAddress']),

      async chooseadd() {
        const [err, succ] = await uni.chooseAddress().catch(err => err)
        console.log(err, succ, 77)

        if (succ && succ.errMsg === 'chooseAddress:ok') {
          var address = {
            userName: succ.userName,
            telNumber: succ.telNumber,
            infoAddress: succ.provinceName + succ.cityName + succ.countyName + succ.detailInfo
          }
          this.UpdateAddress(address)
        }






        //支付的时候需要填写  商品信息 和收货地址

      }
    }
  }
</script>

<style lang="scss">
  .box {
    font-size: 12px;
    display: flex;

    background: url(../../static/cart_border@2x.png) no-repeat center bottom / 100% 6px;
  }

  .addressInfo {
    padding: 10px;
    box-sizing: border-box;
    width: 750rpx;

    .box2 {
      display: flex;
      width: 100%;
      justify-content: space-between;
    }
  }
</style>
